<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui" xmlns:sec="http://www.springframework.org/security/facelets/tags" template="/WEB-INF/include/template/squelette.xhtml">


	<ui:define name="content">
		<f:metadata>
			<f:event type="preRenderView" listener="#{beanLogin.init()}" />
		</f:metadata>


		<sec:isAnonymous>

			<p:growl autoUpdate="true" globalOnly="true" />
			<div align="center">
				<table>
					<tr>
						<h:panelGroup rendered="#{!empty requestScope['javax.servlet.error.message']}">
							<td class="error-msg"><h:outputText value="Erreur : #{requestScope['javax.servlet.error.message']}" /></td>
						</h:panelGroup>
					</tr>
					<tr>
						<td><h:form prependId="false">
								<p:panel style="width: 475px" header="Panneau d'identification">
									<div align="left">
										<h:panelGrid columns="3">
											<p:outputLabel value="#{msg['ihm.libelle.email']}" for="j_username" />
											<p:inputText id="j_username" value="#{beanLogin.login}" size="40" />
											<p:message for="j_username" />
											<p:outputLabel value="#{msg['ihm.libelle.mot_de_passe']}" for="j_password" />
											<p:inputText id="j_password" value="#{beanLogin.password}" type="password" size="40" />
											<p:message for="j_password" />
											<p:outputLabel value="#{msg['ihm.libelle.rememberme']}" />
											<input type="checkbox" name="_spring_security_remember_me" />
										</h:panelGrid>
										<p:separator />
										<div align="right">
											<p:commandButton value="#{msg['ihm.libelle.creer_compte']}" icon="user-add" update=":id-frm-creer-compte" oncomplete="dialogCreationCompte.show()" immediate="true" />
											<p:commandButton id="btn-valid" value="#{msg['ihm.bouton.valider']}" icon="valid" action="#{beanLogin.doLogin()}" ajax="false" />
										</div>

										<p:defaultCommand target="btn-valid" />
									</div>
								</p:panel>
							</h:form></td>
					</tr>
				</table>
			</div>

			<p:dialog widgetVar="dialogCreationCompte" modal="true" resizable="false" draggable="false" closeOnEscape="true" appendToBody="true" width="755">
				<f:facet name="header">
					<h:outputText value="#{msg['ihm.libelle.creer_compte']}" />
				</f:facet>
				<h:form id="id-frm-creer-compte">

					<p:panel header="#{msg['ihm.libelle.info_compte']}">
						<h:panelGrid columns="3">
							<p:outputLabel for="id-ipt-login" value="#{msg['ihm.libelle.email']}" />
							<p:inputText id="id-ipt-login" value="#{beanCreerCompte.utilisateur.username}" size="40" required="true" />
							<p:message for="id-ipt-login" />

							<p:outputLabel for="id-ipt-password" value="#{msg['ihm.libelle.mot_de_passe']}" />
							<p:inputText id="id-ipt-password" value="#{beanCreerCompte.utilisateur.password}" type="password" size="40" required="true" />
							<p:message for="id-ipt-password" />

							<p:outputLabel for="id-ipt-theme" value="#{msg['ihm.libelle.theme']}" />
							<p:inputText id="id-ipt-theme" value="#{beanCreerCompte.utilisateur.compte.theme}" />
							<p:message for="id-ipt-theme" />
						</h:panelGrid>
					</p:panel>

					<p:separator />

					<p:panel header="#{msg['ihm.libelle.info_utilisateur']}">
						<h:panelGrid columns="3">
							<p:outputLabel for="id-ipt-nom" value="#{msg['ihm.libelle.nom']}" />
							<p:inputText id="id-ipt-nom" value="#{beanCreerCompte.utilisateur.information.nom}" size="40" required="true" />
							<p:message for="id-ipt-nom" />

							<p:outputLabel for="id-ipt-prenom" value="#{msg['ihm.libelle.prenom']}" />
							<p:inputText id="id-ipt-prenom" value="#{beanCreerCompte.utilisateur.information.prenom}" size="40" required="true" />
							<p:message for="id-ipt-prenom" />

							<p:outputLabel for="id-cal-date-naissance" value="#{msg['ihm.libelle.date_naissance']}" />
							<p:calendar id="id-cal-date-naissance" value="#{beanCreerCompte.utilisateur.information.dateNaissance}" effect="slideDown" showOn="button" pattern="dd/MM/yyyy" locale="fr" navigator="true" display="inline" yearRange="c-50:c+50" />
							<p:message for="id-cal-date-naissance" />

							<p:outputLabel for="id-ipt-numero-telephone" value="#{msg['ihm.libelle.numero_telephone']}" />
							<p:inputText id="id-ipt-numero-telephone" value="#{beanCreerCompte.utilisateur.information.numeroTelephone}" size="40" />
							<p:message for="id-ipt-numero-telephone" />

							<p:outputLabel for="id-ipt-numero-portable" value="#{msg['ihm.libelle.numero_portable']}" />
							<p:inputText id="id-ipt-numero-portable" value="#{beanCreerCompte.utilisateur.information.numeroPortable}" size="40" />
							<p:message for="id-ipt-numero-portable" />
						</h:panelGrid>
					</p:panel>

					<p:separator />

					<div align="right">
						<p:commandButton value="#{msg['ihm.bouton.annuler']}" icon="close" oncomplete="dialogCreationCompte.hide()" immediate="true" />
						<p:commandButton id="crea-compte-btn-valid" value="#{msg['ihm.bouton.valider']}" icon="valid" action="#{beanCreerCompte.valider()}" update="@form" />
					</div>
					
					<p:defaultCommand target="crea-compte-btn-valid" />

				</h:form>
			</p:dialog>
		</sec:isAnonymous>
	</ui:define>
</ui:composition>